import React from 'react'
import styled from 'styled-components'
import _Link from 'next/link';

const Link = ({ children, className, href, ...rest }) => {
  console.log('rest:', rest);

  return (
    <_Link href={href} passHref={true}>
      <a className={className}>
        {children}
      </a>
    </_Link>
  )
};

const StyledLink = styled(Link)`
  color: palevioletred;
  font-weight: bold;
`;

export default ()=>(
  <div>
    <Link href={'/00'}>Unstyled, boring Link</Link>
    <br />
    <StyledLink href={'/00'}>Styled, exciting Link</StyledLink>
  </div>
)
